import React, { Component } from 'react';
import { Modal, Form, Input } from 'antd';

const FormItem = Form.Item;

class UserEdit extends Component {
    render() {
        const { visible, onCancel, onCreate, form, formData } = this.props;
        const { getFieldDecorator } = form;
        const FormItemLayout = {
            labelCol: { span: 5 },
            wrapperCol: { span: 16 },
        };
        return (
            <Modal
                visible={visible}
                title='用户编辑'
                okText='确认'
                cancelText='取消'
                onCancel={onCancel}
                onOk={onCreate}
            >
                <Form layout="horizontal">
                    {formData.username === 'admin' ?
                        <FormItem label="用户名" {...FormItemLayout} hasFeedback>
                            {getFieldDecorator('username', {
                                rules: [{ required: true, message: '请输入用户名！' }],
                                initialValue: formData.username
                            })(
                                <Input disabled/>
                            )}
                        </FormItem> :
                        <FormItem label="用户名" {...FormItemLayout} hasFeedback>
                            {getFieldDecorator('username', {
                                rules: [{ required: true, message: '请输入用户名！' }],
                                initialValue: formData.username
                            })(
                                <Input />
                            )}
                        </FormItem>}
                    <FormItem label="密码" {...FormItemLayout} hasFeedback>
                        {getFieldDecorator('password', {
                            rules: [{ required: true, message: '请输入密码！' }],
                            initialValue: formData.password
                        })(
                            <Input type="password"/>
                        )}
                    </FormItem>
                </Form>
            </Modal>
        );
    }
}

const UserModal = Form.create()(UserEdit);
export default UserModal;